

.signal{
  border:8px solid transparent;
  border-radius:100%;
  margin:0 auto;
}
.dot{
  height:30px;
  width:30px;
  background:#000;
  margin-top:8px;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  border-radius:50%;
}
.out{
  width:120px;
  height:120px;
  margin:60px auto;
  border-top-color:#000;
  -webkit-animation:outerSignal 3s infinite linear;
  -moz-animation:outerSignal 3s infinite linear;
  -o-animation:outerSignal 3s infinite linear;
  animation:outerSignal 3s infinite linear;
  margin-bottom: 0px;
}
.middle{
  width:90px;
  height:90px;
  margin:10px auto;
  border-top-color:#000;
  -webkit-animation:middleSignal 3s infinite linear;
  -moz-animation:middleSignal 3s infinite linear;
  -o-animation:middleSignal 3s infinite linear;
  animation:middleSignal 3s infinite linear;
}
.in{
  width:60px;
  height:60px;
  margin:10px auto;
  border-top-color:#000;
  -webkit-animation:innerSignal 3s infinite linear;
  -moz-animation:innerSignal 3s infinite linear;
  -o-animation:innerSignal 3s infinite linear;
  animation:innerSignal 3s infinite linear;
}

@keyframes "innerSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:#000;
  }
  75% {
    border-top-color:#000;
  }
  100% {
    border-top-color:#000;
  }
}
@keyframes "middleSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:#000;
  }
  100% {
    border-top-color:#000;
  }
}
@keyframes "outerSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:transparent;
  }
  100% {
    border-top-color:#000;
  }
}
@-webkit-keyframes "innerSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:#000;
  }
  75% {
    border-top-color:#000;
  }
  100% {
    border-top-color:#000;
  }
}
@-webkit-keyframes "middleSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:#000;
  }
  100% {
    border-top-color:#000;
  }
}
@-webkit-keyframes "outerSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:transparent;
  }
  100% {
    border-top-color:#000;
  }
}

.dot1{
  height:30px;
  width:30px;
  background:#fff;
  margin-top:8px;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  border-radius:50%;
}
.out1{
  width:120px;
  height:120px;
  margin:60px auto;
  border-top-color:#fff;
  -webkit-animation:bout 3s infinite linear;
  -moz-animation:bout 3s infinite linear;
  -o-animation:bout 3s infinite linear;
  animation:bout 3s infinite linear;
}
.middle1{
  width:90px;
  height:90px;
  margin:10px auto;
  border-top-color:#fff;
  -webkit-animation:bmin 3s infinite linear;
  -moz-animation:bmin 3s infinite linear;
  -o-animation:bmin 3s infinite linear;
  animation:bmin 3s infinite linear;
}
.in1{
  width:60px;
  height:60px;
  margin:10px auto;
  border-top-color:#fff;
  -webkit-animation:bin 3s infinite linear;
  -moz-animation:bin 3s infinite linear;
  -o-animation:bin 3s infinite linear;
  animation:bin 3s infinite linear;
}




@keyframes "bin" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:#fff;
  }
  75% {
    border-top-color:#fff;
  }
  100% {
    border-top-color:#fff;
  }
}
@keyframes "bmid" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:#fff;
  }
  100% {
    border-top-color:#fff;
  }
}
@keyframes "bout" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:transparent;
  }
  100% {
    border-top-color:#fff;
  }
}
@-webkit-keyframes "bin" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:#fff;
  }
  75% {
    border-top-color:#fff;
  }
  100% {
    border-top-color:#fff;
  }
}
@-webkit-keyframes "bmid" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:#fff;
  }
  100% {
    border-top-color:#fff;
  }
}
@-webkit-keyframes "bout" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:transparent;
  }
  100% {
    border-top-color:#fff;
  }
}